<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui"
	xmlns:pt="http://xmlns.jcp.org/jsf/passthrough"
	xmlns:jsf="http://xmlns.jcp.org/jsf" template="/WEB-INF/template.xhtml">

	<ui:define name="title">
        Dashboard
    </ui:define>

	<ui:define name="description">
        Let you refine your profiles
    </ui:define>

	<ui:define name="implementation">

		<h:form>
			<p:growl id="growl" life="2000" />

			<h:panelGrid columns="3" style="width:100%;">
				<p:panel id="added" header="Profiles added">
					<h:panelGrid columns="2" style="width:100%;">
						<h:outputText value="Last Week" />
						<h:outputText value="#{dashboardManagedBean.lstWkCnt}" />
						<h:outputText value="Last Month" />
						<h:outputText value="#{dashboardManagedBean.lstMnthCnt}" />
						<h:outputText value="Last Year" />
						<h:outputText value="#{dashboardManagedBean.lstYrCnt}" />
					</h:panelGrid>
				</p:panel>

				<p:panel id="updated" header="Profiles Updated">
					<h:panelGrid columns="2" style="width:100%;">
						<h:outputText value="Last Week" />
						<h:outputText value="#{dashboardManagedBean.lstWkRecUpdtCnt}" />
						<h:outputText value="Last Month" />
						<h:outputText value="#{dashboardManagedBean.lstMnthRecUpdtCnt}" />
						<h:outputText value="Last Year" />
						<h:outputText value="#{dashboardManagedBean.lstYrRecUpdtCnt}" />
					</h:panelGrid>
				</p:panel>

				<p:panel id="ratio" header="Male Vs Female">
					<h:panelGrid columns="2" style="width:100%;">
						<h:outputText value="Total Male/Female" />
						<h:outputText
							value="#{dashboardManagedBean.maleCnt}/#{dashboardManagedBean.femaleCnt}" />
						<h:outputText value="" />
						<h:outputText value="" />
						<h:outputText value="" />
						<h:outputText value="" />
					</h:panelGrid>
				</p:panel>
				<p:dataTable value="#{dashboardManagedBean.professionList}"
					var="item" scrollable="true" scrollRows="5" scrollHeight="200">
					
					<p:column headerText="Profession">
						<h:outputText value="#{item.key}" />
					</p:column>
					<p:column headerText="count">
						<h:outputText value="#{item.value}" />
					</p:column>
				</p:dataTable>
				
				<p:dataTable value="#{dashboardManagedBean.heightList}" var="item" scrollable="true" scrollRows="5" scrollHeight="200">
					<p:column headerText="Height">
						<h:outputText value="#{item.key}" />
					</p:column>
					<p:column headerText="Count">
						<h:outputText value="#{item.value}" />
					</p:column>
				</p:dataTable>
				<p:dataTable value="#{dashboardManagedBean.starList}" var="item" scrollable="true" scrollRows="5" scrollHeight="200">
					<p:column headerText="Star">
						<h:outputText value="#{item.key}" />
					</p:column>
					<p:column headerText="Count">
						<h:outputText value="#{item.value}" />
					</p:column>
				</p:dataTable>
			</h:panelGrid>

		</h:form>

	</ui:define>



</ui:composition>
